<template>
    <div>
        <!-- 坐席信息模块 -->
        <box-group-wrap pageTitle="坐席信息" :isShowData="isShowData">
            <template slot="wrapBody">
                <div class="user_wrap">
                    <div class="user_top">
                        <div class="user_img">
                            <img
                                v-if="userAssociate.userAvatar"
                                :src="userAssociate.userAvatar"
                                alt
                                width="80px"
                                height="90px"
                            />
                            <img
                                v-else
                                src="@/assets/img/khindex/userDefault.png"
                                alt
                                width="85px"
                                height="90px"
                            />
                        </div>
                        <div class="user_right">
                            <div>
                                <img
                                    v-if="userInfo.labelCommunist==='1'"
                                    src="@/assets/img/khindex/dhui.png"
                                    alt
                                    width="26px"
                                />
                                <img
                                    v-else
                                    src="@/assets/img/khindex/nuMessage.png"
                                    alt
                                    width="26px"
                                />
                                <span class="user_nme">{{userInfo.userName}}</span>
                            </div>

                            <p>
                                <span>工号：</span>
                                <span>{{userInfo.ctiNum}}</span>
                            </p>
                            <p>
                                <span>分机：</span>
                                <span>{{userInfo.extensionNum}}</span>
                            </p>
                            <p>
                                <span>组别：</span>
                                <span>{{teamInfo.teamName}}</span>
                            </p>
                        </div>
                    </div>
                    <div class="user_bom">
                        <p>{{userAssociate.userMotto}}</p>
                    </div>
                </div>
            </template>
        </box-group-wrap>
    </div>
</template>
<script>
import { mapGetters } from 'vuex';
import { isEmptyObject } from '@/utils/Object';
import BoxGroupWrap from '@/components/boxgroupwrap/BoxGroupWrap.vue';
export default {
    name: 'Seatinfor',
    data() {
        return {
        }
    },
    components: { 'box-group-wrap': BoxGroupWrap, },
    computed: {
        ...mapGetters([
            'userInfo',
            'teamInfo',
            'userAssociate',
        ]),
        isShowData() {
            return !isEmptyObject(this.userInfo);
        }
    },
    mounted() {
        // console.log('用户基本信息展示', this.userInfo);
        // this.isShowData = true
    },
    methods: {

    },
}
</script>
<style scoped lang="scss">
.user_wrap {
    .user_top {
        text-align: left;
        .user_img {
            margin: 5px 10px 5px 25px;
        }
        .user_right {
            margin-left: 10px;
            > div,
            > p {
                line-height: 14px;
                padding: 5px 5px;
            }
            .user_nme {
                font-size: 16px;
                font-weight: bold;
                margin-left: 15px;
                vertical-align: super;
            }
        }
        .user_img,
        .user_right {
            display: inline-block;
        }
    }
    .user_bom p {
        color: #0080ff;
        margin-bottom: 10px;
    }
}
</style>